<template>
    <div class="index-body">
        <div class="index-top">
            <my-header></my-header>
        </div>
        <div class="index-content">
            <div class="col-md-2">
                <div class="index-left" :style="leftWidHei">
                    <div>
                        <calendar></calendar>
                    </div>
                    <div>
                        <leftnav></leftnav>
                    </div>
                </div>
            </div>
            <div class="col-md-10">
                <div class="index-right" :style="rightWidHei">
                    <router-view></router-view>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    // new vue()
    module.exports = {
        data: function () {
            return {
                leftWidHei: {
//                    width: '200px',
                    height: ($(window).height() - 52) + 'px'
                },
                rightWidHei: {
//                    width: ($(window).width() - 202) + 'px',
                    height: ($(window).height() - 55) + 'px'
                }
            }
        },
        components: {
            'my-header': require('../components/header.vue'),
            'leftnav': require('../components/leftnav.vue'),
            'calendar': require('../components/calendar.vue')
        }
    };
</script>

<style>

    .index-body {
        height: 100%;
        width: 100%;
    }
    .index-body .col-md-2 {
        padding: 2px 3px 0px 0px;
    }
    .index-body .col-md-10 {
        padding: 2px 0px 0px 3px;
    }
    .index-body .index-top {
        width: 100%;
        height: auto;
    }
    .index-body .index-content{
        height: 100%;
    }
    .index-body .index-content .index-left {
        background-color: #F5F6E2;
        border-right: 1px #6699CC solid;
        border-top-right-radius: 8px;
    }

    .index-body .index-content .index-right {
        margin-top: 1px;
        overflow-x: hidden;
        overflow-y: scroll;
    }
</style>